<template>
  <div>
    <header class="mui-bar mui-bar-nav">
      <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left" @click="goBack()"></a>
      <h1 class="mui-title" v-text="title"></h1>
      <button @click="add"></button>
      <span>{{$store.state.count}}</span>
      <mt-switch v-model="$store.getters.up.selected"  @change="cc($store.getters.up.selected)"></mt-switch>
    </header>
  </div>
</template>
<script>
export default {
  data () {
    return {

    }
  },
  props: ['title'],
  methods: {
    goBack () {
      this.$router.go(-1)
    },
    add () {
      this.$store.commit('substract')
    },
    cc (val) {
      console.log(val, this.$store.getters.up)
    }
  }
}
</script>
<style scoped>
.mui-bar.mui-bar-nav {
  position: relative;
}
</style>
